/*
路由配置规则
*/
/*
  1. 动态导入需要配置的组件
  2. 配置
*/
// 标签页，公共布局引入   一级路由
const Layout = () => import('@/views/layout')
// 首页。第一个标签页   二级路由
const Home = () => import('@/views/home')
// 问答。第二个标签页   二级路由
const Question = () => import('@/views/question')
// 视频。第三个标签页   二级路由
const Video = () => import('@/views/video')
// 我的。第四个标签页   二级路由
const Profile = () => import('@/views/profile')
// 登录。登录页   一级路由
const Login = () => import('@/views/login')
// 用户资料。编辑用户资料页  一级路由
const User = () => import('@/views/user')
// 搜索页。搜索文章页  一级路由
const Search = () => import('@/views/search')
// 小智聊天页  一级路由
const Chat = () => import('@/views/user/chat')
// 搜索结果页面  一级路由
const Result = () => import('@/views/search/result')
// 文章详情页
const Article = () => import('@/views/article')

const routes = [
  // 首页
  {
    path: '/',
    // 公共布局
    component: Layout,
    children: [
      // 底部标签页 (首页，问答，视频，我的)
      {
        path: '/',
        name: 'Home',
        component: Home,
        // 需要缓存的
        meta: { isKeepAlive: true }
      },
      {
        path: '/question',
        name: 'Question',
        component: Question
      },
      {
        path: '/video',
        name: 'Video',
        component: Video
      },
      {
        path: '/user',
        name: 'Profile',
        component: Profile
      }
    ]
  },
  // 编辑用户资料
  {
    path: '/user/profile',
    name: 'User',
    component: User
  },
  // 小智聊天
  {
    path: '/user/chat',
    name: 'Chat',
    component: Chat
  },
  // 登录页
  {
    path: '/login',
    name: 'Login',
    component: Login
  },
  // 搜索页
  {
    path: '/search',
    name: 'Search',
    component: Search
  },
  // 搜索结果页
  {
    path: '/search/result',
    name: 'Result',
    component: Result
  },
  // 文章详情页
  {
    path: '/article/:id',
    name: 'Article',
    component: Article,
    // 需要缓存的
    meta: { isKeepAlive: true }
  }
  // {
  //   path: '/about',
  //   name: 'About',
  //   // route level code-splitting
  //   // this generates a separate chunk (about.[hash].js) for this route
  //   // which is lazy-loaded when the route is visited.
  //   component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  // }
]

// 导出routes
export default routes
